@for (node of selectedNodes(); track node.key) {
  <div class="relative mr-2 h-full flex" @listFadeIn>
    @if (node.entity) {
      @switch (node.type) {
        @case('agent') {
          <xpert-studio-panel-agent class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            [key]="node.key"
          />
        }
        @case ('xpert') {
          <xpert-studio-panel-xpert class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            [node]="node"
          />
        }
        @case ('toolset') {
          <xpert-studio-panel-toolset class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            [node]="node"
          />
        }
        @case ('knowledge') {
          <xpert-studio-panel-knowledge class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            [node]="node"
          />
        }
        @case ('workflow') {
          <xpert-studio-panel-workflow class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            [node]="node"
          />
        }
      }
    }

    <div class="absolute top-2 right-2 z-20 opacity-50 hover:opacity-100" displayDensity="compact">
      <!-- <button mat-icon-button (click)="close()">
        <mat-icon>close</mat-icon>
      </button> -->
    </div>
  </div>
}

@if (sidePanel(); as sidePanel) {
  <div class="flex gap-2">
    @switch (sidePanel) {
      @case ('preview') {
        @if (executionId()) {
          <xpert-studio-panel-execution [id]="executionId()" class="h-full bg-components-panel-bg shadow-lg border-[0.5px] border-components-panel-border rounded-2xl overflow-y-auto
            w-[420px]"
            (close)="closeExecution()"
          />
        }
        <xpert-studio-panel-preview (execution)="executionId.set($event)"/>
      }

      @case ('variables') {
        <xpert-studio-panel-variables />
      }
    }

  </div>
}